<!DOCTYPE html>
<html>

<head>
	<!-- 页面meta -->
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>商品分类管理</title>
	<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
	<link rel="stylesheet" href="/plugins/bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" href="/plugins/adminLTE/css/AdminLTE.css">
	<link rel="stylesheet" href="/plugins/adminLTE/css/skins/_all-skins.min.css">
	<link rel="stylesheet" href="/css/style.css">
	<script src="/plugins/jQuery/jquery-2.2.3.min.js"></script>
	<script src="/plugins/bootstrap/js/bootstrap.min.js"></script>

</head>
<script>
	var quly=0;
	$(function(){
		catList();
	})
	function catList(){
		$.ajax({
			url:"/itemcat/itemcatList",
			data:{},
			type:"post",
			dataType:"json",
			async:false,
			success:function(result){
				console.log(result);
				if (result.code == 10000){
					var list = result.data;
					var str = '';
					for (var i = 0; i < list.length; i++){
						str+='<tr>'
						str+='<td><input type="checkbox"></td>'
						str+='<td>'+list[i].id+'</td>'
						str+='<td>'+list[i].name+'</td>'
						str+='<td>'+list[i].typeId+'</td>'
						str+='<td className="text-center">'
						str+='<button type="button" className="btn bg-olive btn-xs" onclick="subordinate('+list[i].id+')">查询下级</button>'
						str+='<button type="button" className="btn bg-olive btn-xs" data-toggle="modal" onclick="huixian('+list[i].id+')" data-target="#editModal">修改</button>'
						str+='<button type="button" class="btn btn-default" onclick="deletedd('+list[i].id+')"  title="删除" ><i class="fa fa-trash-o"></i> 删除</button>'
						str+='</td>'
						str+='</tr>'
					}
					$("#itemcatcout").html(str)
				}else{
					$("#typetemplate").html('<tr><td colspan="7">没数据</td></tr>')
				}
			},error:function(){
				alert("系统异常");
			}
		})
	}

	function subordinate(id){
		quly=id
		$("#parentId").val(quly);
		$("#parentId1").val(quly);
		$.ajax({
			url: "/itemcat/querysubordinate",
			data:{id:id},
			async: false,
			dataType: "",
			type: "post",
			async: true,
			success: function (result) {
				var list = result.data;
				if (list.length==0){
					alert("已经为，最后一页")
					return;
				}
				var str=''
				for (var i=0;i<list.length;i++){
					str+='<tr>'
					str+='<td><input type="checkbox" name="box" value="'+list[i].id+'"></td>'
					str+='<td>'+list[i].id+'</td>'
					str+='<td>'+list[i].name+'</td>'
					str+='<td>'+list[i].typeId+'</td>'
					str+='<td className="text-center">'
					str+='<button type="button" className="btn bg-olive btn-xs"  onclick="subordinate('+list[i].id+')">查询下级</button>'
					str+='<button type="button" className="btn bg-olive btn-xs" data-toggle="modal"data-target="#editModal" onclick="huixian('+list[i].id+')">修改</button>'
					str+='<button type="button" class="btn btn-default" onclick="deletedd('+list[i].id+')"  title="删除" ><i class="fa fa-trash-o"></i> 删除</button>'
					str+='</td>'
					str+='</tr>'
				}
				daohid=id
				if (daohid>0){
					getDaoh(daohid);
				}
				$("#itemcatcout").html(str)
			},
			error: function (data) {
				alert("系统异常稍后重试")
			}
		})
	}
	function getDaoh(id){
		$.ajax({
			url: "/itemcat/getdaoh",
			data:{id:id},
			async: false,
			dataType: "",
			type: "post",
			async: true,
			success: function (result) {
				var list =result.data
				var str=''
				for (var i=0;i<list.length;i++){
					str+='<li>'
					str+='<a href="itemcat/getDaoh" >'+list[i].name+'</a> '
					str+='</li>'
				}
				$("#io").append(str)
				console.log(list)
			},
			error: function () {
				alert("系统异常稍后重试")
			}
		})
	}
	function toAdd(){
		var name = $("#name").val()
		var typeId = $("#typeId").val()
		$.ajax({
			url: "/itemcat/insertInfo",
			data:{parentId:quly,name:name,typeId:typeId},
			async: false,
			dataType: "",
			type: "post",
			async: true,
			success: function (result) {
				catList();
			},
			error: function () {
				alert("系统异常稍后重试")
			}
		})
	}

	function huixian(id){
		$.ajax({
			url: "/itemcat/selectById",
			data:{id:id},
			async: false,
			dataType: "json",
			type: "post",
			async: true,
			success: function (result) {
				var tbItemCat = result.data;
				$("#id").val(tbItemCat.id);
				$("#name1").val(tbItemCat.name);
				$("#typeId1").val(tbItemCat.typeId);
			},
			error: function () {
				alert("系统异常稍后重试")
			}
		})
	}

	function updateInfo4(){
		var id = $("#id").val();
		var name = $("#name1").val();
		var typeId = $("#typeId1").val();
		var parentId = $("#parentId1").val();
		$.ajax({
			url: "/itemcat/updateInfo",
			data:{id:id,name:name,typeId:typeId,parentId:parentId},
			async: false,
			dataType: "json",
			type: "post",
			async: true,
			success: function (result) {
				if (result.code == 10000){
					catList();
				}
			},
			error: function () {
				alert("系统异常稍后重试")
			}
		})
	}
	function deletedd(id){
		$.ajax({
			url: "/itemcat/deletedd",
			data:{id:id},
			async: false,
			dataType: "",
			type: "post",
			async: true,
			success: function (result) {
				catList();
			},
			error: function (data) {
				alert("系统异常稍后重试")
			}
		})
	}
</script>

<body class="hold-transition skin-red sidebar-mini" >
<!-- .box-body -->

<div class="box-header with-border">
	<h3 class="box-title">商品分类管理
	</h3>
</div>

<div class="box-body">
	<ol class="breadcrumb" id="io">
		<li>
			<a href="javascript:subordinate(0)" >顶级分类列表</a>
		</li>
		<!--		                        <li>-->
		<!--		                       		<a href="#" >珠宝</a>-->
		<!--		                        </li>-->
		<!--		                        <li>-->
		<!--		                        	<a href="#" >银饰</a>-->
		<!--		                        </li>-->
	</ol>

	<!-- 数据表格 -->
	<div class="table-box">

		<!--工具栏-->
		<div class="pull-left">
			<div class="form-group form-inline">
				<div class="btn-group">
					<button type="button" class="btn btn-default" title="新建" data-toggle="modal" data-target="#inserteditModal" ><i class="fa fa-file-o"></i> 新建</button>
					<button type="button" class="btn btn-default"  title="删除" ><i class="fa fa-trash-o"></i> 删除</button>
					<button type="button" class="btn btn-default" title="刷新" ><i class="fa fa-check"></i> 刷新</button>

				</div>
			</div>
		</div>


		<!--数据列表-->
		<table id="dataList" class="table table-bordered table-striped table-hover dataTable">
			<thead>
			<tr>
				<th class="" style="padding-right:0px">
					<input type="checkbox" class="icheckbox_square-blue">
				</th>
				<th class="sorting_asc">分类ID</th>
				<th class="sorting">分类名称</th>
				<th class="sorting">类型模板ID</th>

				<th class="text-center">操作</th>
			</tr>
			</thead>
			<tbody id="itemcatcout">

			</tbody>
		</table>
		<!--数据列表/-->

	</div>
	<!-- 数据表格 /-->




</div>
<!-- /.box-body -->
<!-- 增加窗口 -->
<div class="modal fade" id="inserteditModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true">
	<div class="modal-dialog" >
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="myModalLabel1">商品分类编辑</h3>
			</div>
			<div class="modal-body">
				<input type="hidden" name="sortId">
				<table class="table table-bordered table-striped"  width="800px">
					<tr>
						<td>上级商品分类</td>
						<td >
							<input type="hidden" name="parentId" id="parentId">
						</td>
					</tr>
					<tr>
						<td>商品分类名称</td>
						<td><input  class="form-control" name="name" id="name" placeholder="商品分类名称">  </td>
					</tr>
					<tr>
						<td>类型模板</td>
						<td>
							<input select2 config="options['type_template']" name="typeId" id="typeId" placeholder="商品类型模板" class="form-control" type="text"/>
						</td>
					</tr>
				</table>

			</div>
			<div class="modal-footer">
				<button class="btn btn-success" data-dismiss="modal" onclick="toAdd()" aria-hidden="true">保存</button>
				<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">关闭</button>
			</div>
		</div>
	</div>
</div>


<!-- 编辑窗口 -->
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog" >
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="myModalLabel">商品分类编辑</h3>
			</div>
			<div class="modal-body">

				<table class="table table-bordered table-striped"  width="800px">
					<tr>
						<td>上级商品分类</td>
						<td>
							<input type="text" name="id" id="id">
							<input type="text" name="parentId" id="parentId1">
						</td>
					</tr>
					<tr>
						<td>商品分类名称</td>
						<td><input  class="form-control" id="name1" placeholder="商品分类名称">  </td>
					</tr>
					<tr>
						<td>类型模板</td>
						<td>
							<input select2 config="options['type_template']" placeholder="商品类型模板" id="typeId1" class="form-control" type="text"/>
						</td>
					</tr>
				</table>

			</div>
			<div class="modal-footer">
				<button class="btn btn-success" data-dismiss="modal" onclick="updateInfo4()" aria-hidden="true">保存</button>
				<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">关闭</button>
			</div>
		</div>
	</div>
</div>
</body>
</html>